<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>随手快递</title>
    <link href="css/share.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" type="text/css" href="../../AUI/css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../font-awesome/css/font-awesome.min.css" />
    <style>
        .link{
            background-color: #eeeeee;
            width: 100%;
            height: 50px;
            margin: 15px 0 0 0;
            padding:5px 10px 5px 5px;
        }
    </style>
</head>
<body style="overflow-x: hidden">
<header class="aui-bar aui-bar-nav" id="aui-header">
    <a class="aui-btn aui-pull-left" tapmode onclick="location.href='../system/friendList.html'">
        <span class="fa fa-address-book fa-lg"></span>
    </a>
    <div class="aui-title">好友圈</div>
    <div class="aui-btn aui-pull-right" onclick="location.href='pubArticle.html'"><span class="fa fa-plus fa-lg"></span></div>
</header>

<p id="show" style="display: none"></p>
<div id="wrapper" style="margin-top: 48px;padding: 0 0px 40px 0px;">
        <div id="circlelist" style="margin: 0px 10px;">
            <div class="aui-card-list">
                <div class="aui-card-list-header aui-card-list-user">
                    <div class="aui-card-list-user-avatar">
                        <img src="../../myImage/4.jpg" class="aui-img-round">
                    </div>
                    <div class="aui-card-list-user-name">
                        <div class="aui-text-info" style="color:#525252 !important;">小小1</div>
                        <div class="aui-font-size-14 text-light"></div>
                    </div>
                    <div class="aui-card-list-user-info text-light"></div>
                </div>
                <div class="aui-card-list-content-padded aui-padded-t-5 aui-padded-b-5">
                    <div class="link" onclick="location.href='orderDetail.html'"><img src="../../myImage/xg.jpg" style="width: 45px;height: 40px;float: left;margin-right: 10px">
                        <div style="display: inline-block;">帮我买 <b style="">半个西瓜</b> 谢谢ヾ(o◕∀◕)ﾉヾ</div></div>
                </div>
                <div class="aui-card-list-footer text-light aui-font-size-14">
                    <div>
                        <div class="share" > <i class="aui-iconfont aui-icon-share share"></i> 0</div>
                    </div>
                    <div>
                        <i class="aui-iconfont aui-icon-comment"></i> 0
                    </div>
                    <div>
                        <i class="aui-iconfont aui-icon-laud" onclick="good(this)"> 0</i>
                    </div>
                </div>
            </div>
            <div class="aui-card-list">
                <div class="aui-card-list-header aui-card-list-user">
                    <div class="aui-card-list-user-avatar">
                        <img src="../../myImage/1.jpeg" class="aui-img-round">
                    </div>
                    <div class="aui-card-list-user-name">
                        <div class="aui-text-info" style="color:#525252 !important;">summy</div>
                        <div class="aui-font-size-14 text-light"></div>
                    </div>
                    <div class="aui-card-list-user-info text-light">2分钟前</div>
                </div>
                <div class="aui-card-list-content-padded aui-padded-t-5 aui-padded-b-5">
                    尝试了一下随手快递！！！真的懒人必备！！！
                </div>
                <div class="aui-card-list-content-padded ">
                    <div class="aui-row aui-row-padded" >
                        <div class="aui-col-xs-4"><img src="../../myImage/g1.jpg"></div></div>
                </div>
                <div class="aui-card-list-footer text-light aui-font-size-14">
                    <div>
                        <div class="share" > <i class="aui-iconfont aui-icon-share share"></i> 1</div>
                    </div>
                    <div>
                        <i class="aui-iconfont aui-icon-comment"></i> 1
                    </div>
                    <div>
                        <i class="aui-iconfont aui-icon-laud" onclick="good(this)">2</i>
                    </div>
                </div>
            </div>
            </div>
    </div>




<footer class="aui-bar aui-bar-tab" id="footer"></footer>

<script type="text/javascript" src="../../AUI/script/api.js" ></script>
<script src="../../myJs/jquery.js"></script>
<script src="../../myJs/jquery.cookie.js"></script>
<script type="text/javascript" src="../../AUI/script/aui-tab.js" ></script>
<script type="text/javascript" src="../../myJs/iscroll.js" ></script>
<script type="text/javascript" src="../../AUI/script/aui-pull-refresh.js"></script>
<script type="text/javascript" src="../../myJs/index.js" ></script>
<script type="text/javascript" src="js/share.js"></script>
<script type="text/javascript">
    apiready = function(){
        api.parseTapmode();
    }

    var data = {
        "code": 200,
        "msg": [
           /* {
                "userId": "1",
                "headPortraitUrl": "../../myImage/1.jpeg",
                "nickname": "summy",
                "comment": "尝试了一下随手快递！！！真的懒人必备！！！",
                "time": "2分钟",
                "share": "1",
                "chat": "1",
                "good":"2",
                "img":["../../myImage/g1.jpg"]
            },*/{
                "userId": "2",
                "headPortraitUrl": "../../myImage/16.jpg",
                "nickname": "旧事不挽",
                "comment": "进口小零食好好次",
                "time": "5分钟",
                "share": "5",
                "chat": "7",
                "good":"10",
                "img":["../../myImage/22.jpg","../../myImage/21.jpg","../../myImage/22.jpg"]
            },{
                "userId": "3",
                "headPortraitUrl": "../../myImage/5.png",
                "nickname": "我爱吃小饼干",
                "comment": "和一个小姐姐好有缘！刚去超市就看到有人想买我最爱吃的饼干，然后我们巴拉巴拉聊了一堆hhhhh~",
                "time": "13分钟",
                "share": "3",
                "chat": "2",
                "good":"12",
                "img":["../../myImage/23.jpg"]
            },{
                "userId": "4",
                "headPortraitUrl": "../../myImage/6.jpg",
                "nickname": "不将就",
                "comment": "粉色少女心",
                "time": "30分钟",
                "share": "10",
                "chat": "22",
                "good":"29",
                "img":["../../myImage/24.jpg"]
            },{
                "userId": "5",
                "headPortraitUrl": "../../myImage/7.jpg",
                "nickname": "怪她动情的脸",
                "comment": "最近几天飞意大利，有没有要代购的？？",
                "time": "33分钟",
                "share": "6",
                "chat": "20",
                "good":"44",
                "img":["../../myImage/35.jpg","../../myImage/37.jpg","../../myImage/36.jpg","../../myImage/32.jpg","../../myImage/31.jpg","../../myImage/30.jpg"]
            }/*,{
                "userId": "6",
                "headPortraitUrl": "../../myImage/12.jpg",
                "nickname": "撩.",
                "comment": "进行中",
                "time": "41分钟",
                "share": "9",
                "chat": "31",
                "good":"87",
                "img":["../../myImage/24.jpg"]
            },{
                "userId": "7",
                "headPortraitUrl": "../../myImage/13.jpg",
                "nickname": "予我温酒几杯",
                "comment": "进行中",
                "time": "42分钟",
                "share": "18",
                "chat": "32",
                "good":"88",
                "img":["../../myImage/24.jpg"]
            },{
                "userId": "8",
                "headPortraitUrl": "../../myImage/14.jpg",
                "nickname": "HHHHHHm",
                "comment": "进行中",
                "time": "49分钟",
                "share": "7",
                "chat": "36",
                "good":"96",
                "img":["../../myImage/24.jpg"]
            },{
                "userId": "9",
                "headPortraitUrl": "../../myImage/15.jpg",
                "nickname": "橙子",
                "comment": "进行中",
                "time": "58分钟",
                "share": "30",
                "chat": "55",
                "good":"184",
                "img":["../../myImage/24.jpg"]
            },{
                "userId": "10",
                "headPortraitUrl": "../../myImage/16.jpg",
                "nickname": "Ada",
                "comment": "进行中",
                "time": "1小时",
                "share": "41",
                "chat": "68",
                "good":"228",
                "img":["../../myImage/24.jpg"]
            },{
                "userId": "11",
                "headPortraitUrl": "../../myImage/17.jpg",
                "nickname": "执妄",
                "comment": "进行中",
                "time": "1小时20分钟",
                "share": "6",
                "chat": "21",
                "good":"77",
                "img":["../../myImage/24.jpg"]
            },{
                "userId": "12",
                "headPortraitUrl": "../../myImage/18.jpg",
                "nickname": "半梦半醒。",
                "comment": "进行中",
                "time": "1小时42分钟",
                "share": "58",
                "chat": "68",
                "good":"119",
                "img":["../../myImage/24.jpg"]
            },{
                "userId": "13",
                "headPortraitUrl": "../../myImage/19.jpg",
                "nickname": "杞暖",
                "comment": "进行中",
                "time": "2小时",
                "share": "25",
                "chat": "56",
                "good":"163",
                "img":["../../myImage/24.jpg"]
            },{
                "userId": "14",
                "headPortraitUrl": "../../myImage/20.jpg",
                "nickname": "素子花开",
                "comment": "进行中",
                "time": "2小时",
                "share": "9",
                "chat": "178",
                "good":"276",
                "img":["../../myImage/24.jpg"]
            }*/

        ]

    }
    $(function(){
        index();
        $("#item3").addClass("aui-active");
        viewCircle(data);
    });

    function viewCircle(data){
        var imgnum = 0;
        $.each(data.msg,function(num,data){
            imgnum = num;
            $("#circlelist").append(' <div class="aui-card-list" >\
                    <div class="aui-card-list-header aui-card-list-user">\
                    <div class="aui-card-list-user-avatar">\
                    <img src="'+data.headPortraitUrl+'" class="aui-img-round">\
                    </div>\
                    <div class="aui-card-list-user-name">\
                    <div class="aui-text-info" style="color:#525252 !important;">'+data.nickname+'</div>\
                    <div class="aui-font-size-14 text-light"></div>\
            </div>\
            <div class="aui-card-list-user-info text-light">'+data.time+'前</div>\
            </div>\
            <div class="aui-card-list-content-padded aui-padded-t-5 aui-padded-b-5">\
            '+data.comment+'\
            </div>\
            <div class="aui-card-list-content-padded ">\
                <div class="aui-row aui-row-padded" id="img'+num+'">\
                </div>\
            </div>\
            <div class="aui-card-list-footer text-light aui-font-size-14">\
             <div>\
                    <i class="aui-iconfont aui-icon-share share"></i> '+data.share+'\
                </div>\
                <div>\
                    <i class="aui-iconfont aui-icon-comment"></i> '+data.chat+'\
                </div>\
                <div>\
                    <i class="aui-iconfont aui-icon-laud" onclick="good(this)">'+data.good+'</i> \
                </div>\
            </div>\
            </div>');
            if(data.img!=null) {
                $.each(data.img, function (num, data) {
                    $("#img"+imgnum).append('<div class="aui-col-xs-4">' +
                            '<img src="'+data+'">' +
                            '</div>');
                })
            }

        })
    }

    function good(node){
        var num =node.innerHTML;
        node.style.color="#FF9811";
        node.innerHTML=(parseInt(num)+1);

    }
</script>
<script>
   /* refresher.init({
        id:"wrapper",
        pullDownAction:Refresh,
        pullUpAction:Load
    });*/

   /* function Refresh() {
        //alert(data);
        setTimeout(function () {	// <-- Simulate network congestion, remove setTimeout from production!
            var el, li, i;
            el =document.querySelector("#wrapper ul");
            //这里写你的刷新代码
            document.getElementById("wrapper").querySelector(".pullDownIcon").style.display="none";
            setTimeout(function () {
                wrapper.refresh();
                var el, li, i;
                el =document.querySelector("#wrapper ul");
                var buys = data.user.buys;
                $.each(buys,function(num,buys){
                    li = document.createElement('li');
                    li.innerHTML = '  <div class="aui-media-list-item-inner">\
                    <div class="aui-list-item-media" style="width: 3rem;">\
                    <img src="'+buys.headUrl+'" class="aui-img-round">\
                    </div>\
                    <div class="aui-list-item-inner">\
                    <div class="aui-list-item-text">\
                    <div class="aui-list-item-title aui-font-size-14">'+buys.nickname+'&nbsp;&nbsp;<span class="fa fa-star" style="color: #FFC107"></span></div>\
            <div class="aui-list-item-right">'+buys.purchaseState+'</div>\
                    </div>\
                    <div class="aui-list-item-text">\
                    <div class="aui-list-item-title aui-font-size-14"></div>\
                    <div class="aui-list-item-right">'+buys.acceptTime+'</div>\
            </div>\
            </div>\
            </div>';
                    el.insertBefore(li, el.childNodes[0]);
                })
            },1000);//模拟qq下拉刷新显示成功效果
            /!****remember to refresh after  action completed！ ---yourId.refresh(); ----| ****!/
        }, 1000);
    }
    function Load() {
        setTimeout(function () {// <-- Simulate network congestion, remove setTimeout from production!
            var el, li, i;
            el =document.querySelector("#wrapper ul");
            var buys = data.user.buys;
            $.each(buys,function(num,buys){
                li = document.createElement('li');
                li.innerHTML = ' <div class="aui-media-list-item-inner">\
                    <div class="aui-list-item-media" style="width: 3rem;">\
                    <img src="'+buys.headUrl+'" class="aui-img-round">\
                    </div>\
                    <div class="aui-list-item-inner">\
                    <div class="aui-list-item-text">\
                    <div class="aui-list-item-title aui-font-size-14">'+buys.nickname+'&nbsp;&nbsp;<span class="fa fa-star" style="color: #FFC107"></span></div>\
            <div class="aui-list-item-right">'+buys.purchaseState+'</div>\
                    </div>\
                    <div class="aui-list-item-text">\
                    <div class="aui-list-item-title aui-font-size-14"></div>\
                    <div class="aui-list-item-right">'+buys.acceptTime+'</div>\
            </div>\
            </div>\
            </div>';
                el.appendChild(li, el.childNodes[0]);
            })
            wrapper.refresh();/!****remember to refresh after action completed！！！   ---id.refresh(); --- ****!/
        },1000);
    }*/
    $('.share').shareConfig({
        Shade : true, //是否显示遮罩层
        Event:'click', //触发事件
        Content : 'Share', //内容DIV ID
        Title : '我爱分享' //显示标题
    });
</script>

<script  type="text/javascript">
    
</script>
</body>
</html>